<template>
  <div class="app-container2 shebeiguzhang_warp">
    <div class="left_box">
      <commonTree />
    </div>
    <div class="right_box">
      <div class="top_btns">
        <div class="btns_left" @click="onShowDialogFn(true)">
          <img src="../../../assets/images/zhenduanguize_icon.png" alt="" />
          <div>诊断规则配置</div>
        </div>
        <div class="btns_right">
          <div class="btns_item btns_item1">
            <img src="../../../assets/images/bofang_icon1.png" alt="" />
            <div>开始故障诊断</div>
          </div>
          <div class="btns_item">
            <img src="../../../assets/images/tingzhi_icon1.png" alt="" />
            <div>停止故障诊断</div>
          </div>
        </div>
      </div>
      <div class="line_wrap"></div>
      <div class="tabbar_list">
        <div class="tabbar_item act">设备一</div>
        <!-- <div class="tabbar_item">设备二</div> -->
      </div>
      <div class="main_content">
        <div class="content_left">
          <div class="prev_btn" @click="onSwiperNextItemFn"></div>
          <div class="swiper_main">
            <el-carousel
              :autoplay="false"
              arrow="never"
              indicator-position="none"
              ref="cardShow"
            >
              <el-carousel-item v-for="item in swiperList" :key="item.id">
                <div class="swiper_item">
                  <div class="swiper_img">
                    <img :src="item.imgUrl" alt="" />
                  </div>
                </div>
              </el-carousel-item>
            </el-carousel>
          </div>
          <div class="next_btn" @click="onSwiperPrevItemFn"></div>
        </div>
        <div class="content_right">
          <div class="content_right_table">
            <el-table
              class="jk_common_table000"
              style="width: 100%; height: 100%"
              height="style"
              :data="tableData"
            >
              <el-table-column label="序号" width="80px">
                <template slot-scope="scop">
                  {{ (scop.$index + 1 + "").padStart(2, "0") }}
                </template>
              </el-table-column>
              <el-table-column prop="time" label="诊断时间"></el-table-column>
              <el-table-column prop="rules" label="诊断规则"></el-table-column>
              <el-table-column
                prop="treeName"
                label="故障树名称"
              ></el-table-column>
              <el-table-column label="故障诊断结果" width="120px">
                <template slot-scope="scop">
                  <div
                    :class="[
                      'zhenduan_result',
                      getZhenduanClass(scop.row.result),
                    ]"
                  >
                    {{ scop.row.result }}
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <div class="content_right_fenye">
            <el-pagination
              class="jk_common_fenyeqi000"
              :current-page="1"
              :page-size="10"
              :pager-count="5"
              :append-to-body="false"
              popper-class="js_common_fenyeqi_popper"
              layout="total,prev, pager, next,sizes, jumper"
              :total="400"
            ></el-pagination>
          </div>
        </div>
      </div>
      <div class="tree_wrap">
        <treeBox :treeChartData="treeChartData" />
      </div>
    </div>
    <el-dialog
      title="模块信息"
      :visible.sync="dialogVisible"
      width="50%"
      custom-class="jk_common_dialog000"
    >
      <span slot="title" class="dialog_header_wrap"> 诊断规则弹窗 </span>
      <span class="dialog_content">
        <el-table
          class="jk_common_table000"
          style="width: 100%"
          :data="tableData2"
        >
          <el-table-column label="序号" width="80px">
            <template slot-scope="scop">
              {{ (scop.$index + 1 + "").padStart(2, "0") }}
            </template>
          </el-table-column>
          <el-table-column prop="name" label="设备名称"></el-table-column>
          <el-table-column prop="type" label="设备类型"></el-table-column>
          <el-table-column prop="rules" label="诊断规则配置"></el-table-column>
          <el-table-column prop="desc" label="诊断规则描述"></el-table-column>
        </el-table>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import treeBox from "./components/treeBox.vue";
import commonTree from "../../../components/commonTree";
import * as echarts from "echarts";
export default {
  components: {
    treeBox,
    commonTree,
  },
  data() {
    return {
      tableData: [
        {
          id: "001",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "故障",
        },
        {
          id: "002",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "正常",
        },
        {
          id: "002",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "正常",
        },
        {
          id: "004",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "正常",
        },
        {
          id: "005",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "异常",
        },
        {
          id: "006",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "异常",
        },
        {
          id: "007",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "异常",
        },
        {
          id: "008",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "异常",
        },
        {
          id: "009",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "异常",
        },
        {
          id: "010",
          time: "2023-12-01 12:04:09",
          rules: " 服务器故障诊断规则1",
          treeName: "通信服务01-CS-A失效",
          result: "故障",
        },
      ],
      dialogVisible: false,
      tableData2: [
        {
          id: "001",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "002",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "003",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "004",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "005",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "006",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "007",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "008",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "009",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
        {
          id: "010",
          name: "通讯服务器1",
          type: "通讯服务器",
          rules: " 服务器故障诊断规则1",
          desc: "顶事件",
        },
      ],
      swiperList: [
        {
          id: "001",
          imgUrl: require("../../../assets/images/wljg_item01.png"),
        },
        {
          id: "002",
          imgUrl: require("../../../assets/images/wljg_item02.png"),
        },
        {
          id: "003",
          imgUrl: require("../../../assets/images/wljg_item04.png"),
        },
      ],
      treeChartData: [
        {
          name: "本控制站(控制器软件)发生不可接受故障",
          relationType: 0,
          label: {
            backgroundColor: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
              { offset: 0, color: "#CDDBEC" },
              { offset: 0.02, color: "#CDDBEC" },
              { offset: 0.02, color: "#0649A1" },
              { offset: 1, color: "#0649A1" },
            ]), // 文字块的背景颜色
          },
          children: [
            {
              name: "一层控制站处理功能故障",
              label: {
                backgroundColor: new echarts.graphic.LinearGradient(
                  0,
                  0,
                  1,
                  0,
                  [
                    { offset: 0, color: "#2C8F45" },
                    { offset: 0.02, color: "#2C8F45" },
                    { offset: 0.02, color: "#0C4553" },
                    { offset: 1, color: "#0C4553" },
                  ]
                ), // 文字块的背景颜色
              },
              children: [
                {
                  name: "主备控制器A、B同时故障",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#2C8F45" },
                        { offset: 0.02, color: "#2C8F45" },
                        { offset: 0.02, color: "#0C4553" },
                        { offset: 1, color: "#0C4553" },
                      ]
                    ), // 文字块的背景颜色
                  },
                  children: [
                    {
                      name: "双路电源均故障",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                    {
                      name: "配置管理故障",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                    {
                      name: "程序运行故障",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#2C8F45" },
                            { offset: 0.02, color: "#2C8F45" },
                            { offset: 0.02, color: "#0C4553" },
                            { offset: 1, color: "#0C4553" },
                          ]
                        ), // 文字块的背景颜色
                      },
                      children: [
                        {
                          name: "程序运行故障",
                          label: {
                            backgroundColor: new echarts.graphic.LinearGradient(
                              0,
                              0,
                              1,
                              0,
                              [
                                { offset: 0, color: "#6E82A3" },
                                { offset: 0.02, color: "#6E82A3" },
                                { offset: 0.02, color: "#0B2D5D" },
                                { offset: 1, color: "#0B2D5D" },
                              ]
                            ), // 文字块的背景颜色
                          },
                        },
                        {
                          name: "逻辑未运行",
                          label: {
                            backgroundColor: new echarts.graphic.LinearGradient(
                              0,
                              0,
                              1,
                              0,
                              [
                                { offset: 0, color: "#6E82A3" },
                                { offset: 0.02, color: "#6E82A3" },
                                { offset: 0.02, color: "#0B2D5D" },
                                { offset: 1, color: "#0B2D5D" },
                              ]
                            ), // 文字块的背景颜色
                          },
                        },
                        {
                          name: "程序执行异常",
                          label: {
                            backgroundColor: new echarts.graphic.LinearGradient(
                              0,
                              0,
                              1,
                              0,
                              [
                                { offset: 0, color: "#6E82A3" },
                                { offset: 0.02, color: "#6E82A3" },
                                { offset: 0.02, color: "#0B2D5D" },
                                { offset: 1, color: "#0B2D5D" },
                              ]
                            ), // 文字块的背景颜色
                          },
                        },
                      ],
                    },
                    {
                      name: "网络风暴故障",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                  ],
                },
                {
                  name: "主备控制器A、B冗余功能故障",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#2C8F45" },
                        { offset: 0.02, color: "#2C8F45" },
                        { offset: 0.02, color: "#0C4553" },
                        { offset: 1, color: "#0C4553" },
                      ]
                    ), // 文字块的背景颜色
                  },
                  children: [
                    {
                      name: "组态工程缺失",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                    {
                      name: "主备控制器操作系统不一致",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                    {
                      name: "主备控制器驱动程序不一致",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                    {
                      name: "主备控制器应用程序不一致",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                    {
                      name: "主备控制器组态数据比对不一致",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                    {
                      name: "主备控制器FPGA程序不一致",
                      label: {
                        backgroundColor: new echarts.graphic.LinearGradient(
                          0,
                          0,
                          1,
                          0,
                          [
                            { offset: 0, color: "#6E82A3" },
                            { offset: 0.02, color: "#6E82A3" },
                            { offset: 0.02, color: "#0B2D5D" },
                            { offset: 1, color: "#0B2D5D" },
                          ]
                        ), // 文字块的背景颜色
                      },
                    },
                  ],
                },
              ],
            },
            {
              name: "本控制站内通信功能故障",
              label: {
                backgroundColor: new echarts.graphic.LinearGradient(
                  0,
                  0,
                  1,
                  0,
                  [
                    { offset: 0, color: "#2C8F45" },
                    { offset: 0.02, color: "#2C8F45" },
                    { offset: 0.02, color: "#0C4553" },
                    { offset: 1, color: "#0C4553" },
                  ]
                ), // 文字块的背景颜色
              },
              children: [
                {
                  name: "同步网(第三以太网)通信故障",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#6E82A3" },
                        { offset: 0.02, color: "#6E82A3" },
                        { offset: 0.02, color: "#0B2D5D" },
                        { offset: 1, color: "#0B2D5D" },
                      ]
                    ), // 文字块的背景颜色
                  },
                },
                {
                  name: "总线AB双路通信状态故障",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#6E82A3" },
                        { offset: 0.02, color: "#6E82A3" },
                        { offset: 0.02, color: "#0B2D5D" },
                        { offset: 1, color: "#0B2D5D" },
                      ]
                    ), // 文字块的背景颜色
                  },
                },
              ],
            },
            {
              name: "本控制站与外部通讯故障",
              label: {
                backgroundColor: new echarts.graphic.LinearGradient(
                  0,
                  0,
                  1,
                  0,
                  [
                    { offset: 0, color: "#2C8F45" },
                    { offset: 0.02, color: "#2C8F45" },
                    { offset: 0.02, color: "#0C4553" },
                    { offset: 1, color: "#0C4553" },
                  ]
                ), // 文字块的背景颜色
              },
              children: [
                {
                  name: "AB双网故障",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#6E82A3" },
                        { offset: 0.02, color: "#6E82A3" },
                        { offset: 0.02, color: "#0B2D5D" },
                        { offset: 1, color: "#0B2D5D" },
                      ]
                    ), // 文字块的背景颜色
                  },
                },
              ],
            },
            {
              name: "时钟故障",
              label: {
                backgroundColor: new echarts.graphic.LinearGradient(
                  0,
                  0,
                  1,
                  0,
                  [
                    { offset: 0, color: "#2C8F45" },
                    { offset: 0.02, color: "#2C8F45" },
                    { offset: 0.02, color: "#0C4553" },
                    { offset: 1, color: "#0C4553" },
                  ]
                ), // 文字块的背景颜色
              },
              children: [
                {
                  name: "B码通道PPS状态异常",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#6E82A3" },
                        { offset: 0.02, color: "#6E82A3" },
                        { offset: 0.02, color: "#0B2D5D" },
                        { offset: 1, color: "#0B2D5D" },
                      ]
                    ), // 文字块的背景颜色
                  },
                },
                {
                  name: "B码通道码状态异常",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#6E82A3" },
                        { offset: 0.02, color: "#6E82A3" },
                        { offset: 0.02, color: "#0B2D5D" },
                        { offset: 1, color: "#0B2D5D" },
                      ]
                    ), // 文字块的背景颜色
                  },
                },
                {
                  name: "B码双通道故障",
                  label: {
                    backgroundColor: new echarts.graphic.LinearGradient(
                      0,
                      0,
                      1,
                      0,
                      [
                        { offset: 0, color: "#6E82A3" },
                        { offset: 0.02, color: "#6E82A3" },
                        { offset: 0.02, color: "#0B2D5D" },
                        { offset: 1, color: "#0B2D5D" },
                      ]
                    ), // 文字块的背景颜色
                  },
                },
              ],
            },
          ],
        },
      ],
    };
  },
  methods: {
    getZhenduanClass(str) {
      if (str === "故障") {
        return "gz";
      } else if (str === "正常") {
        return "zc";
      } else if (str === "异常") {
        return "yc";
      }
    },
    onShowDialogFn(flag) {
      this.dialogVisible = flag;
    },
    onSwiperNextItemFn() {
      this.$refs.cardShow.next();
    },
    onSwiperPrevItemFn() {
      this.$refs.cardShow.prev();
    },
  },
};
</script>
<style lang="scss" scoped>
.shebeiguzhang_warp {
  display: flex;
  .left_box {
    flex: 0 0 auto;
  }
  .right_box {
    flex: 1 1 auto;
    width: 0;
    margin-left: 10px;
    background: linear-gradient(
      180deg,
      rgba(21, 52, 104, 0.5),
      rgba(12, 29, 57, 0.5)
    );
    box-sizing: border-box;
    padding: 20px 20px 10px;
    display: flex;
    flex-direction: column;
    .top_btns {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      .btns_left {
        border: 1px solid #476cb3;
        border-radius: 4px;
        padding: 0 15px;
        height: 40px;
        display: flex;
        align-items: center;
        font-size: 16px;
        color: #badbff;
        cursor: pointer;
        &:hover {
          opacity: 0.9;
        }
        & > img {
          margin-right: 8px;
        }
      }
      .btns_right {
        display: flex;
        align-items: center;
        .btns_item {
          cursor: pointer;
          display: flex;
          align-items: center;
          padding: 0 18px;
          border-radius: 6px;
          background-color: #004dad;
          font-size: 16px;
          color: #fff;
          text-align: center;
          height: 40px;
          line-height: 40px;
          margin-left: 15px;
          &.btns_item1 {
            background-color: #007f72;
          }
          &:hover {
            opacity: 0.9;
          }
          & > img {
            margin-right: 10px;
          }
        }
      }
    }
    .line_wrap {
      flex: 0 0 auto;
      width: 100%;
      height: 2px;
      background: #364775;
      position: relative;
      margin: 20px 0;
      &::after {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 84px;
        background-color: #0065e3;
      }
    }
    .tabbar_list {
      flex: 0 0 auto;
      padding: 0 22px 10px;
      display: flex;
      align-items: center;
      border-bottom: 2px solid #334570;
      .tabbar_item {
        height: 40px;
        border-radius: 6px;
        padding: 0 38px;
        text-align: center;
        line-height: 40px;
        font-size: 16px;
        margin-left: 34px;
        color: #badbff;
        cursor: pointer;
        &.act,
        &:hover {
          background-color: #1a3a8a;
          color: #f5faff;
        }
        &:first-child {
          margin-left: 0;
        }
      }
    }
    .main_content {
      width: 100%;
      height: 300px;
      flex: 0 0 auto;
      margin-top: 15px;
      display: flex;
      .content_left {
        width: 460px;
        flex: 0 0 auto;
        margin-right: 30px;
        position: relative;
        .prev_btn,
        .next_btn {
          position: absolute;
          top: 50%;
          width: 40px;
          height: 152px;
          transform: translateY(-50%);
          background-size: 100% 100%;
          cursor: pointer;
          z-index: 3;
          &:hover {
            opacity: 0.9;
          }
        }

        .prev_btn {
          left: 18px;
          background: url("../../../assets/images/3_2_swiper_btn1.png") center
            center no-repeat;
        }
        .next_btn {
          right: 18px;
          background: url("../../../assets/images/3_2_swiper_btn2.png") center
            center no-repeat;
        }
        .swiper_main {
          width: 100%;
          height: 100%;
          background: url("../../../assets/images/3_2_swiper_bg.png") center
            center no-repeat;
          background-size: 100% 100%;
          ::v-deep .el-carousel {
            height: 100%;
          }
          .swiper_item {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            .swiper_img {
              width: 200px;
              height: 200px;
              display: flex;
              align-items: center;
              justify-content: center;
              & > img {
                max-width: 100%;
                max-height: 100%;
              }
            }
          }
        }
      }
      .content_right {
        flex: 1 1 auto;
        width: 0;
        height: 100%;
        display: flex;
        flex-direction: column;
        .content_right_table {
          flex: 1 1 auto;
          height: 0;
          .zhenduan_result {
            &.zc {
              color: #4dffa1;
            }
            &.gz {
              color: #ff552e;
            }
            &.yc {
              color: #ffca4b;
            }
          }
        }
        .content_right_fenye {
          flex: 0 0 auto;
          margin-top: 10px;
        }
      }
    }
    .tree_wrap {
      flex: 1 1 auto;
      margin-top: 15px;
      box-sizing: border-box;
      background: rgba(35, 60, 98, 0.16);
      border: 1px solid #3d485d;
      border-radius: 2px;
    }
  }
  ::v-deep .jk_common_dialog000 {
    .el-dialog__header {
      width: 100%;
      height: 60px;
      background: url("../../../assets/images/dialog000_bg_title.png") center
        center no-repeat;
      background-size: 100% 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      .dialog_header_wrap {
        font-size: 18px;
        font-family: Alibaba PuHuiTi;
        color: #fff;
        padding-bottom: 14px;
        text-shadow: 0px 2px 8px rgba(5, 28, 55, 0.42);
      }
    }
    .el-dialog__body {
    }
  }
}
</style>
